import router from './router'
import { asyncRoutes } from './router'
import store from '@/store'
import NProgress from 'nprogress' // progress bar  进度条
import 'nprogress/nprogress.css' // 进度条样式
const whiteList = ['/login', '/404'] // 路由白名单

// 全局的前置守卫(在页面进入之前，都会经过前置守卫)
router.beforeEach(async (to, from, next) => {
  // 进入页面之前，开启进度条加载
  NProgress.start()
  const token = store.getters.token // 拿到token
  // 如果有token
  if (token) {
    // 那就再判断当前页面是否登录页
    if (to.path === '/login') {
      // 是的话就跳到首页
      next('/')
      NProgress.done() // 加一个强制结束的进度条
    } else {
      // 目标： 先有用户的信息，知道用户是管理者还是普通用户，才跳转页面，然后出现对应身份的左侧菜单

      // 有userId就不去触发接口请求了，没有，才触发
      // 要不一跳转路由就触发接口太耗费性能了
      if (!store.state.user.userInfo.userId) {
        await store.dispatch('user/getUserInfo') // 先等一个异步事件操作完成后，再去放行路由

        // 1、 我们先把所有的动态路由插入进去，看看左侧菜单能不能正常显示，路由能不能正常跳转
        // 2、asyncRoutes是异步操作
        // 调用action同步到vuex中
        store.dispatch('permission/filterRoutes', store.getters.menus)
        // roles.menus
        console.log(store.getters.menus)
        // 计算属性不仅有缓存还可以减少代码长度 vuex menus
        // console.log(store.getters.menus)

        router.addRoutes(asyncRoutes)
        next({
          ...to, // next({ ...to })的目的,是保证路由添加完了再进入页面 (可以理解为重进一次)
          replace: true // 重进一次, 不保留重复历史
        })
      }

      // 不是就继续放行
      next()
    }
    // 如果没有token
  } else {
    // 如果当前页面是路由白名单
    if (whiteList.includes(to.path)) {
      // 就继续
      next()
    } else {
      // 不是就跳到登录页
      next('/login')
      NProgress.done() // 加一个强制结束的进度条
      //   NProgress.done()
    }
  }
})
// 全局的后置守卫（在页面进入之后，会经过后置守卫）
router.afterEach((to, from) => {
  // 进入之后会结束进度条加载，经过了后置守卫之后把进度条关闭
  NProgress.done()
  // 全局后置首位，注意的点：一旦在全局前置守卫做了拦截，拦截到其他页面，后置守卫不会触发
})
// import router from './router'
// import store from './store'
// import { Message } from 'element-ui'
// import NProgress from 'nprogress' // progress bar  进度条
// import 'nprogress/nprogress.css' // 进度条样式
// import { getToken } from '@/utils/auth' //  从cookie里获取token
// import getPageTitle from '@/utils/get-page-title'

// NProgress.configure({ showSpinner: false }) // NProgress Configuration

// // 没登陆能正常访问的页面（路由白名单）
// const whiteList = ['/login', '/404'] // 这里面放一些不需要登录就能访问的页面

// // 路由前置守卫：所有的路由在真正被访问到之前，都会先经过路由前置守卫
// // 只有前置首位放行了，才能继续进入到所访问的页面
// router.beforeEach(async (to, from, next) => {
//   // start progress bar 开始进度条
//   NProgress.start()

//   // set page title 设置页面标题
//   document.title = getPageTitle(to.meta.title)

//   // determine whether the user has logged in
//   // 判断用户是否已登录
//   const hasToken = getToken()

//   // 判断有没有token
//   if (hasToken) {
//     // 判断要去的路径是不是login
//     if (to.path === '/login') {
//       // if is logged in, redirect to the home page
//       next({ path: '/' }) // 直接放行到首页
//       NProgress.done()
//     } else {
//       const hasGetUserInfo = store.getters.name
//       // 判断一下有没有用户的名字
//       if (hasGetUserInfo) {
//         // 有的话就正常放行
//         next()
//       } else {
//         // 否则
//         try {
//           // get user info
//           // 获取用户个人信息的请求
//           await store.dispatch('user/getInfo')

//           next()
//         } catch (error) {
//           // remove token and go to login page to re-login 删除token，转到登录页面重新登录
//           await store.dispatch('user/resetToken') // 如果获取用户个人信息失败的话
//           // 就清除token
//           Message.error(error || 'Has Error')
//           // 转到登录页面
//           next(`/login?redirect=${to.path}`)
//           NProgress.done()
//         }
//       }
//     }
//   } else {
//     // 没有token，代表当前的用户没登陆
//     /* has no token*/
//     // 没有token就继续判断我们要访问的页面在不在白名单里面
//     if (whiteList.indexOf(to.path) !== -1) {
//       // in the free login whitelist, go directly
//       // 在白名单中，直接跳转
//       next()
//     } else {
//       // other pages that do not have permission to access are redirected to the login page.
//       // 要是不在白名单里面就跳转到登录页去
//       next(`/login?redirect=${to.path}`)
//       NProgress.done()
//     }
//   }
// })
// // 后置的路由钩子函数
// router.afterEach(() => {
//   // finish progress bar 完成进度条
//   NProgress.done()
// })
